<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>安全设置</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./layui/css/layui.css">
    <link rel="stylesheet" href="./css/background.css">
    <link rel="stylesheet" href="./css/color.css">
    <link rel="stylesheet" href="./css/margin.css">
    <link rel="stylesheet" href="./css/header.css">
    <link rel="stylesheet" href="./css/wtlPay.css">
</head>
<body>


   <div id="main">
       <!--顶部导航-->
       <div class="l-nav">

           <div class="l-container">
               <!--logo-->
               <div class="l-logo">
                   <img class="l-img" src="./image/wtlogo.png" alt="无法显示" />
               </div>

               <!--菜单栏-->
               <ul class="layui-nav l-line-none" lay-filter="">
                   <li class="layui-nav-item"><a href="">首页</a></li>
                   <li class="layui-nav-item"><a href="">账户中心</a></li>
                   <li class="layui-nav-item">
                       <a href="javascript:;">语言</a>
                       <dl class="layui-nav-child">
                           <dd><a href="#"><img src="./image/China.png" alt=""> 中文</a></dd>
                           <dd><a href="#"><img style="width: 29px; height: 18px;" src="./image/usa.jpg" alt=""> 英语</a></dd>
                       </dl>
                   </li>
                   <li class="layui-nav-item l-login-out"><a href="">欢迎您：kingend</a><span>退出</span></li>
               </ul>
           </div>
       </div>

       <!--面包屑导航-->
       <div class="l-breadcrumb">
           <span class="l-breadcrumb-title">您的位置：</span>
           <span class="layui-breadcrumb">
              <a href="">首页</a>
              <a href="">账户中心</a>
              <a href=""><cite>安全设置</cite></a>
        </span>
       </div>

       <div class="l-bar">
           <img src="./image/dian.png" alt="无法显示">
           支付方式
       </div>

       <!--绑定主要内容-->
       <div class="l-content-list">
           <div class="l-content-item">
               <p class="l-content-title">绑定支付宝</p>
               <div class="l-content-info">
                   <p><span class="l-color-red">*</span><span>姓名：</span><span>李明</span></p>
                   <p><span class="l-color-red">*</span><span>支付宝：</span><span>asdfasfas@163.com</span></p>
                   <p><span class="l-color-red">*</span><span>备注：</span><span>暂无</span></p>
                   <button data-id="showZhi" id="showzhifubao" class="layui-btn l-btn-change">修改</button>
               </div>
               <img class="l-show-zfb" src="./image/zfb.jpg" alt="显示无法">
           </div>

           <div class="l-content-item">
               <p class="l-content-title">银行卡</p>
               <div class="l-content-info">
                   <p><span class="l-color-red">*</span><span>姓名：</span><span>李明</span></p>
                   <p><span class="l-color-red">*</span><span>银行卡：</span><span>中国银行</span></p>

                   <button data-id="showBank" id="bank" class="layui-btn l-btn-change l-bank">修改</button>
               </div>

           </div>
       </div>

       <!--支付宝弹出层-->
       <form v-show="showzhifubao" class="l-popup layui-form">
           <div class="l-popup-header">
               绑定支付宝
           </div>
           <div class="l-popup-content">
               <div class="l-filed">
                   <label class="l-label"><span class="l-color-red">*</span><span>支付宝账户姓名：</span></label>
                   <span class="l-username">李明（请绑定本人持有支付宝的账户）</span>
               </div>

               <div class="l-filed">
                   <label class="l-label"><span class="l-color-red">*</span><span>支付宝账户：</span></label>
                   <input type="text" name="title" required  lay-verify="required" placeholder="请输入本人持有支付宝账号" autocomplete="off" class="layui-input">
               </div>

               <div class="l-filed">
                   <label class="l-label"><span class="l-color-red">*</span><span>支付宝账户：</span></label>
                   <input type="file" class="l-upload">
                   <div class="layui-btn l-upload-btn">
                       上传
                   </div>
               </div>
               <p class="l-remark-info">支付宝收款码获取方法：打开支付宝APP,在首页点击”收钱“，个人二维码下方点击 ”保存图片“即可</p>

               <div class="l-filed">
                   <label class="l-label"><span class="l-color-red">*</span><span>备注信息：</span></label>
                   <textarea  name="desc" placeholder="暂无" class="layui-textarea l-form-textarea"></textarea>
               </div>

               <p class="l-remark-info">如果希望对方快速联系，可以在备注中添加联系电话，务必防御电话诈骗！</p>

               <div class="l-filed">
                   <label class="l-label"><span class="l-color-red">*</span><span>资金密码：</span></label>
                   <input type="text" name="title" required  lay-verify="required" placeholder="请输入您的资金密码" autocomplete="off" class="layui-input">
               </div>

               <div class="l-btn-group">
                   <button class="layui-btn layui-btn-normal">确定</button>
                   <button class="layui-btn layui-btn-primary">取消</button>
               </div>
           </div>
       </form>


       <!--银行卡弹出层-->
       <form v-show="showBank"  class="l-popup layui-form">
           <div class="l-popup-header">
               绑定银行卡
           </div>
           <div class="l-popup-content">
               <div class="l-filed">
                   <label class="l-label"><span class="l-color-red">*</span><span>姓名：</span></label>
                   <span class="l-username">李明（请绑定本人持有银行卡）</span>
               </div>

               <div class="l-filed">
                   <label class="l-label"><span class="l-color-red">*</span><span>开户银行：</span></label>
                   <div class="layui-form-item">
                       <select name="city" lay-verify="required">
                           <option value=""></option>
                           <option value="0">北京</option>
                           <option value="1">上海</option>
                           <option value="2">广州</option>
                           <option value="3">深圳</option>
                           <option value="4">杭州</option>
                       </select>
                   </div>
               </div>

               <div class="l-filed">
                   <label class="l-label"><span class="l-color-red">*</span><span>开户支行：</span></label>
                   <input type="text" name="title" required  lay-verify="required" placeholder="请输入开户支行" autocomplete="off" class="layui-input">
               </div>
               <p class="l-remark-info">可填写所在支行、市支行、分行营业部或分行核算中心</p>

               <div class="l-filed">
                   <label class="l-label"><span class="l-color-red">*</span><span>银行卡号：</span></label>
                   <input type="text" name="title" required  lay-verify="required" placeholder="请输入银行卡号" autocomplete="off" class="layui-input">
               </div>

               <div class="l-filed">
                   <label class="l-label"><span class="l-color-red">*</span><span>资金密码：</span></label>
                   <input type="text" name="title" required  lay-verify="required" placeholder="请输入您的资金密码" autocomplete="off" class="layui-input">
               </div>

               <div class="l-filed">
                   <label class="l-label">风险提示：</span></label>
                   <p class="l-text-tips">c2c属于场外交易，法币不经过平台，平台不会自动扣款，需要您手动自行转账给对方，对方收到才能款项。绑定银行卡等收款信息只为核对信息之用，不是扣款依据</p>
               </div>

               <p class="l-remark-info l-tips">
                    <input type="checkbox" name="" lay-skin="primary">
                    <span class="l-color-red">我已阅读并充分理解上述内容，由于款项造成的交易风险自行承担</span>
               </p>

               <div class="l-btn-group">
                   <button class="layui-btn layui-btn-normal">确定</button>
                   <button class="layui-btn layui-btn-primary">取消</button>
               </div>
           </div>
       </form>

       <!--遮掩层-->
       <div @click="close" class="l-mask" v-if="isMark"></div>
   </div>
</body>
<script src="./layui/layui.js"></script>
<script src="./js/vue.js"></script>
<script src="./js/wtlPay.js"></script>
</html>